
.sdiv{
    background-color: #fafafa;

    header{
        background-color: #fafafa;
        text-align: left;
        span{
            text-align: left;
            margin-left: 1.6rem;
        }
    }
        
    .sort-main{
        // background-color: #fafafa;
        flex: 1;
        overflow: auto;
        padding: 10px 20px 10px 0;
        // 搜索框
        .search{
            margin-left: 20px;
        }
        .content{
            margin-top: .5rem;
            height: 100%;
            display: flex;
            justify-content: space-between;

            // 左边导航列表
            .left{
                position: relative;
                top: 0;
                left: 0;
                width: 4.8rem;
                background-color: #f3f3f3;
                ul>li{
                    width: 4.6rem;
                    height: 3rem;
                    font-size: 0.8rem;
                    color: #bbbbbb;
                    text-align: center;
                    line-height: 3rem;
                }
            }

            // 右边商品列表
            .right{
                margin-left: 0.4rem;
                width: 100%;
                height: 100%;
                overflow-x: hidden;
                .r-top{
                    width: 100%;
                    height: 6rem;
                    img{
                        width: 100%;
                        height: 100%;
                        border-radius: 0.5rem;
                    }
                }
                .r-cont{
                    height: 6rem;
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    margin-top: 10px;
                    .r-cont-right{
                        height: 6rem;
                        width: 6rem;
                        img{
                            width: 100%;
                            height: 100%;
                        }
                    }
                    .r-cont-left{
                        padding: 10px;
                        flex: 1;
                        height: 100%;
                        display: flex;
                        flex-direction: column;
                        justify-content: space-between;
                        .title{
                            height: 100%;
                            p{
                                margin-top: 10px;
                            }
                        }
                        .pice{
                            height: 100%;
                            margin-top: 30px;
                            display: flex;
                            justify-content: space-between;
                            align-items: center;
                            .pic{
                                color: red;
                                font-size: .9rem;
                            }
                            .car{
                                width: 100px;
                                height: 100%;
                                display: flex;
                                justify-content: space-evenly;
                                align-items: center;
                                font-size: .8rem;
                                span{
                                    display: block;
                                    width: 1rem;
                                    height: 1rem;
                                    border-radius: 10px;
                                    font-size: .8rem;
                                    background: linear-gradient(to bottom, #8ae7bb, #47c489);
                                    text-align: center;
                                    line-height: 18px;
                                }
                            }
                        }
                    }
                }
            }

            
        }
    }
}